Вход

Просмотр полной версии : Как сделать условную валидацию полей

Anushki
29.11.2017, 05:26
Всем привет ребят. Подскажите пожалуйста.

Есть форма:

<form>
<ul class="tab">
<li class="fiz" for="fiz">
<input type="radio" name="who" id="fiz" value="fiz"> Физическое лицо
</li>
<li class="iur" for="iur">
<input type="radio" name="who" id="iur" value="iur"> Юридическое лицо
</li>
</ul>
<fieldset id="fiz">
<input type="text" name="" placeholder="ФИО">
<input type="text" name="" placeholder="Адрес">
<input type="text" name="" placeholder="Должность">
</fieldset>
<fieldset id="iur">
<input type="text" name="" placeholder="ФИО">
<input type="text" name="" placeholder="Регистрационный номер">
<input type="text" name="" placeholder="Название организации">
</fieldset>
</form>


Как сделать условную валидацию? Чтобы например при выборе radio физ лица, поля с radio юр лица не были обязательными к заполнению? И наоборот...

Буду вам очень признательна..
laimas
29.11.2017, 06:49
На jQuery можно так:

<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<style>
div[class|=group] {
display: none;
}
</style>
<script type="text/javascript">
$(function() {
var fields = $('fieldset');
$('.tab input').change(function() {
fields.eq(this.value).show().children().prop('requ ired', 1);
fields.eq(this.value ^ 1).hide().children().prop('required', 0);
});
});
</script>
</head>
<body>
<form>
<ul class="tab">
<li class="fiz">
<input type="radio" name="who" value="0" checked=""> Физическое лицо
</li>
<li class="iur">
<input type="radio" name="who" value="1"> Юридическое лицо
</li>
</ul>
<fieldset>
<input type="text" name="" required="" placeholder="ФИО">
<input type="text" name="" required="" placeholder="Адрес">
<input type="text" name="" required="" placeholder="Должность">
</fieldset>
<fieldset style="display: none;">
<input type="text" name="" placeholder="ФИО">
<input type="text" name="" placeholder="Регистрационный номер">
<input type="text" name="" placeholder="Название организации">
</fieldset>
</form>
</body>
</html>

LI не имеют атрибута for, это у label "для ...".
Anushki
29.11.2017, 13:44
На jQuery можно так:

Спасибо большое laimas :) очень тебе благодарна. выручил